<template>
	<view id="publicityDetail">
		<view class="vote-four-wrap">
			<view class="vote-title">{{publicityInfo.vote_name}}</view>
			<view class="vote-title sub-title" >
				发起时间：{{publicityInfo.begin_time}}
			</view>
			<!-- <view class="vote-title sub-title">
				报名时间：{{publicityInfo.begin_time}}
			</view> -->
		</view>
		<view class="vote-content">
			<view class="content">
				{{publicityInfo.contentL}}
			</view>
		</view>
		<view class="publicity-btn" @click="goToApplication" v-if="isApplicationFlag == false">
			我要报名	
		</view>
		<view class="publicity-btn already" v-else>
			已报名
		</view>
		
		<!-- 报名成功弹框 -->
		<view style="position: relative;">
			<view class="meeting-dialog">
				<u-popup v-model="isSuccess" mode="center" border-radius="14">
					<view class="meeting-wrap">
						<view class="meeting-title">
							报名成功
						</view>
						<view class="meeting-start">
							<image class="img" src="/static/vote/authSucc.png" ></image>
						</view>
						<view class="meeting-cont succ" >
							报名成功！请及时关注小区动态！
						</view>
						<view class="meeting-btn" @click="submit">
							确定
						</view>
					</view>
				</u-popup>
			</view>
		</view>
		
		<!-- 提交认证弹窗 -->
		<view style="position: relative;">
		  <view class="meeting-dialog">
		    <u-popup v-model="certificationFlag" mode="center" border-radius="14">
		      <view class="meeting-wrap">
		        <view class="meeting-title">
		            未提交认证
		        </view>
		        <view class="meeting-start">
		          <image class="img" src="../../../../static/vote/seconded.png" ></image>
		        </view>
		        <view class="meeting-cont">
		          请先进行实名认证后进行报名
		        </view>
		        <view class="meeting-btn" @click="goToCertification()">
		          提交认证
		        </view>
		      </view>
		    </u-popup>
		  </view>
		</view>
		
	</view>
</template>

<script>
	export default{
		data(){
			return{
				id:null,
				publicityInfo:{},
				publicitytype : null,//1.招募筹备组 5.招募委员
			    voteUserInfo : {},//表决用户认证信息
				isApplicationFlag : false,//是否报名
				isCertifiedFlag : false,//是否为认证用户
				
				certificationFlag : false,//控制认证窗口
				
				isSignUp:false,//是否报名  报名提交后显示已报名
				isSuccess:false, //报名是否成功弹框
				

				listData:{},
				
			}
		},
		onLoad(options) {
			this.id = options.id;
		},
		onShow(){
			this.getPublicityDetail();
		},
		
		methods:{
			//获取公示详情
			getPublicityDetail(){
				this.$requestYz.api.getPublicityDetail({
					id:this.id,//关注人id
				}).then(res => {
					this.publicityInfo = res.data.data;
					//1.招募组报名
					this.publicitytype = this.publicityInfo.vote_type
					this.getVoteUserInfo();
				})
			},
			getVoteUserInfo(){
				this.$requestYz.api.getApplicationState({
					id:this.publicityInfo.id,
					user_id : uni.getStorageSync('rawData').userId,
				}).then(res => {
					this.voteUserInfo = res.data.data;
					//判断是否可报名
					//筹备组报名
					if(!this.voteUserInfo.id){
						//需要认证
						return;
					}
					this.isCertifiedFlag = true;
					if(this.publicitytype == 1){
						// 已报名||是筹备组成员
						if(this.voteUserInfo.preparation_enroll == 1 ||this.voteUserInfo.preparation_status == 1){
							this.isApplicationFlag = true;
						}
					}else if(this.publicitytype == 5){
						// 已报名委员
						if(this.voteUserInfo.committee_member_status == 1 || this.voteUserInfo.committee_member_status == 4){
							this.isApplicationFlag = true;
						}
					}else if(this.publicitytype == 14){
						// 已报名委员
						if(this.voteUserInfo.committee_member_status == 1 || this.voteUserInfo.committee_member_status == 4){
							this.isApplicationFlag = true;
						}
					}else if(this.publicitytype == 19){
						// 已报名谈判组业主
						if(this.voteUserInfo.whether_owner == 1){
							this.isApplicationFlag = true;
						}
					}
				})
			},
			
			goToApplication(){
				if(!this.isCertifiedFlag){
					//去认证
					this.certificationFlag = true;
					return;
				}else{
					//去报名
					uni.navigateTo({
						url:'./mySignUp?id=' + this.voteUserInfo.id +'&applicationType='+this.publicitytype+'&publicityId='+this.id
					})
				}
				
			},
			//去认证
			goToCertification(){
				this.certificationFlag = false;
				uni.navigateTo({
				  url:'../../submitAuth?vote_id='+this.publicityInfo.essential_information_id+"&proName="+this.publicityInfo.community_name
				})
			},
		
			signUp(){
				this.isSignUp = true;
				uni.navigateTo({
					url:'./mySignUp?id=' + this.voteUserInfo.id
				})
			},
			//提交认证
			submit(){
				this.isSuccess = false;
			},
		}
	}
</script>

<style lang="scss">
	$color:#999;
	$bold:bold;
	#publicityDetail{
		background: #f4f4f4;
		height: 100vh;
		.vote-four-wrap{
			padding-top: 60rpx;
			.vote-title{
				font-size: 36rpx;
				font-weight: bold;
				margin: 30rpx auto 0;
				text-align: center;
			}
			.sub-title{
				font-size: 28rpx;
				margin: 20rpx auto;
				font-weight: $bold;
				color: $color;
			}
			.colors{
				color: red;
			}
		}
		.vote-content{
			margin-top: 40rpx;
			width: 100%;
			height: 308px;
			background: #FFFFFF;
			box-shadow: 0px 1px 0px 0px #EEEEEE;
			.content{
				padding: 50rpx;
				font-size: 32rpx;
				font-weight: bold;
			}
		}
		.publicity-btn{
			width: 470rpx;
			height: 88rpx;
			color: #fff;
			background: linear-gradient(180deg, #76D904 0%, #417505 100%);
			border-radius: 44rpx;
			margin: 50rpx auto;
			text-align: center;
			line-height: 88rpx;
		}
		.already{
			background: #fff;
			color: #999;
			border: 1px solid #CCCCCC;
		}
		
		/*弹框*/
		.meeting-dialog{
			position: relative;
			::v-deep .u-mode-center-box{
				width: 670rpx !important;
				height: 800rpx;
				background: #FFFFFF !important;
				border-radius: 12rpx !important;
			}
			.meeting-wrap{
				padding: 40rpx;
			}
			.meeting-title{
				font-size: 18px;
				font-weight: bold;
				padding-bottom:20px;
				border-bottom: 1px solid #E7ECE1;
			}
			.meeting-start{
				margin:40rpx 0 24rpx; 
				font-size: 16px;
				font-weight: bold;
				.img{
					width: 160px;
					height: 114px;
					margin: 0 auto;
					transform: translate(74px, 8px);
				}
			}
			.meeting-cont{
				color:red;
				font-size: 32rpx;
				border-bottom: 60rpx;
				margin-top: 50rpx;
				margin-bottom: 120rpx;
				text-align: center;
			}
			.succ{
				color: #333300;
				font-weight: bold;
			}
			.meeting-btn{
				width: 350rpx;
				height: 88rpx;
				line-height:88rpx;
				background: #FFFFFF;
				border-radius: 22px;
				border: 1px solid #427705;
				text-align: center;
				color:#427705;
				margin: 40px auto;
				font-weight: bold;
			}
		}
	}
</style>